<template >
  <div class="img-upload" id="applyFor_vanList">
    <div class="listWrap" ref="listWrap" :style="{ height: listWrapHeight }">
      <van-list
        v-model="loading"
        offset="10"
        :finished="finished"
        finished-text="没有更多了"
        @load="onLoad"
      >
        <!-- 申请融资 -->
        <div v-if="type == ''">
          <div
            class="wrap"
            v-for="item in dataList"
            :key="item.id"
            @click="jump('/FinancialService/applyFor_bank',{id:item.id})"
          >
            <div class="flex-between flex-center">
              <div class="text1">{{ item.companyName }}</div>
              <!-- <div class="text1">{{ item.content }}</div> -->
              <div :class="item.verifyState == 'UNPASS' ? 'text2' : 'text3'">
                {{
                  item.verifyState == "ING"
                    ? "待审核"
                    : item.verifyState == "PASS"
                    ? "审核通过"
                    : item.verifyState == "UNPASS"
                    ? "未通过"
                    : "成功放款"
                }}
              </div>
            </div>
            <div class="text5">
              <span class="text4">提交人：</span>{{ item.submitPerson }}
            </div>
            <div class="flex-between">
              <div class="text5">
                <span class="text4">日期：</span>{{ item.submitTime }}
              </div>
              <div
                class="text5 flex-center"
                @click.stop="revoke_financingAply(item.id)"
                v-if="item.verifyState == 'ING' && $store.state.userList.role != 'B'"
                
              >
                <img
                  style="width: 0.31rem; height: 0.3rem; margin-right: 0.1rem"
                  src="@/assets/images/nonPublicEconomy/cx.png"
                />撤销
              </div>
            </div>
          </div>
        </div>
        <!-- 申请融资 end-->
        <!-- QYSQ:企业诉求;YSHJTS:营商环境投诉;XYXC:献言献策 -->
        <div v-if="type == 'QYSQ' || type == 'YSHJTS' || type == 'XYXC'">
          <div
            class="wrap"
            v-for="item in dataList"
            :key="item.id"
            @click="jump('/nonPublicEconomy/enterpriseDemands2',{id:item.id})"
          >
            <div class="flex-between flex-center">
              <div class="text1">{{ item.content }}</div>
              <div :class="item.replyState == 'N' ? 'text2' : 'text3'">
                {{ item.replyState == "N" ? "未回复" : "已回复" }}
              </div>
            </div>
            <div class="text5">
              <span class="text4">提交人：</span>{{ item.submitPerson }}
            </div>
            <div class="flex-between">
              <div class="text5">
                <span class="text4">日期：</span>{{ item.submitTime }}
              </div>
            </div>
          </div>
        </div>
        <!-- QYSQ:企业诉求;YSHJTS:营商环境投诉;XYXC:献言献策 end-->
        <!-- 民营经济-企业赋能-信用管理 -->

        <div v-if="type == 'XYGL'">
          <div
            class="wrap"
            v-for="item in dataList"
            :key="item.id"
            @click="jump('/nonPublicEconomy/creditManagement3',{id:item.id})"
          >
            <div class="">
              <div class="text1">{{ item.companyName }}</div>
            </div>
            <div class="text5">
              <span class="text4">法人：</span>{{ item.legalPerson }}
            </div>
          </div>
        </div>
        <!-- 民营经济-企业赋能-信用管理 end -->
        <!-- 民营经济-企业赋能-SYXQ:商务对接需求;FBXQ:共同富裕需求;SBFW:商标服务;ZSCQFW:知识产权服务;GLZXFW:管理咨询服务 -->

        <div
          v-if="
            type == 'SBFW' ||
            type == 'ZSCQFW' ||
            type == 'GLZXFW' ||
            type == 'SYXQ' ||
            type == 'FBXQ'
          "
        >
          <div class="wrap" v-for="item in dataList" :key="item.id"   @click="jump('/nonPublicEconomy/releaseTrademark2',{id:item.id})">
            <div class="flex-between flex-center">
              <div class="text1">{{ item.content }}</div>
              <div :class="item.verifyState == 'UNPASS' ? 'text2' : 'text3'">
                {{
                  item.verifyState == "ING"
                    ? "待审核"
                    : item.verifyState == "PASS"
                    ? "审核通过"
                    : item.verifyState == "UNPASS"
                    ? "未通过"
                    : ""
                }}
              </div>
            </div>
            <div class="text5">
              <span class="text4">提交人：</span>{{ item.submitPerson }}
            </div>
            <div class="flex-between">
              <div class="text5">
                <span class="text4">日期：</span>{{ item.submitTime }}
              </div>
              <div
                class="text5 flex-center"
                @click.stop="revoke_theVerify(item.id)"
              >
                <img
                  style="width: 0.31rem; height: 0.3rem; margin-right: 0.1rem"
                  src="@/assets/images/nonPublicEconomy/cx.png"
                />撤销
              </div>
            </div>
          </div>
        </div>
        <!-- 民营经济-企业赋能-商标服务 end -->
      </van-list>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    // dataList: {
    // 	type: Array,
    // 	default: [],
    // },
    listWrapHeight: {
      type: String,
      default: "9rem",
    },
    type: {
      type: String,
      default: "",
    },
    self: {
      type: String,
      default: "", //是否只查询自己发布的记录（Y：只查自己发布的，会包含未审核的记录；N：查询所有审核通过的，会包括其他企业发布的）
    },
    apiName: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      dataList: [],
      loading: false,
      finished: false,

      searchData: {
        page: 1,
        limit: 7,
        searchKey: "",
        submitTimeBegin: "",
        submitTimeEnd: "",
      },
    };
  },
  created() {},
  mounted() {},
  watch: {},
  methods: {
    revoke_theVerify(id) {
      this.$dialog
        .confirm({
          title: "提示",
          message: "确认撤销吗",
        })
        .then(() => {
          var params = {
            id: id,
          };
          this.$myApi.revoke_theVerify(params).then((res) => {
            if (res.code == 200) {
              this.$notify({
                type: "success",
                message: "操作成功",
              });
              this.finished = true;
              this.clearSearchData();
              this.getData(true);
            } else {
            }
          });
        })
        .catch(() => {
          // on cancel
        });
    },
    revoke_financingAply(id) {
      this.$dialog
        .confirm({
          title: "提示",
          message: "确认撤销吗",
        })
        .then(() => {
          var params = {
            id: id,
          };
          this.$myApi.revoke_financingAply(params).then((res) => {
            if (res.code == 200) {
              this.$notify({
                type: "success",
                message: "操作成功",
              });
              this.finished = true;
              this.clearSearchData();
              this.getData(true);
            } else {
            }
          });
        })
        .catch(() => {
          // on cancel
        });
    },
    onSearch(params) {
      //增加传入的参数并刷新列表
      this.finished = true;
      this.clearSearchData();
      params.page = this.searchData.page;
      params.limit = this.searchData.limit;
      this.searchData = params;
      //   this.$refs.listWrap.top = 0;
      this.getData(true);
    },
    clearSearchData() {
      this.searchData = {
        page: 1,
        limit: 5,
      };
      //   this.finished = false;
      this.dataList = [];
    },
    onLoad() {
      console.log("异步更新数据");
      // 异步更新数据
      this.getData();
    },
    getData(finished) {
      // finished 先关闭后开启 以免情况列表产生触底更新数据
      var params = this.searchData;
      if (this.self) {
        params.self = this.self;
      }
      params.type = this.type;
      this.$myApi[this.apiName](params).then((res) => {
        if (res.code == 200) {
          this.dataList = [...this.dataList, ...res.data];
          console.log(this.dataList);
          this.loading = false;
          this.searchData.page++;
          if (finished) {
            //finished 先关闭后开启 以免情况列表产生触底更新数据
            this.finished = false;
          }
          if (res.data.length < 5) {
            this.finished = true;
          }
        } else {
        }
      });
    },
  },
};
</script>
<style lang="less" scoped>
#applyFor_vanList {
  background: #f8f8f8;
  padding: 0.42rem 0.25rem;
  .listWrap {
    overflow-x: scroll;
  }
  .button {
    width: 5rem;
    height: 0.61rem;
    margin-bottom: 0.44rem;
    border-radius: 30px;
  }
  .wrap {
    padding: 0.5rem;
    background: #fff;
    margin-bottom: 0.44rem;
    .text1 {
      font-size: 0.36rem;
      color: #111111;
      margin-bottom: 0.4rem;
      width: 3.6rem;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }
    .text2 {
      background: #fdecec;
      border-radius: 30px;
      font-size: 0.28rem;
      color: #dfa1a1;
      padding: 0.12rem 0.2rem;
      margin-bottom: 0.4rem;
    }
    .text3 {
      background: #ebf3ff;
      border-radius: 30px;
      font-size: 0.28rem;
      color: #8da9d3;
      padding: 0.12rem 0.2rem;
      margin-bottom: 0.4rem;
    }
    .text4 {
      color: #bbbbbb;
      font-size: 0.28rem;
    }
    .text5 {
      color: #333333;
      font-size: 0.28rem;
      margin-bottom: 0.1rem;
    }
  }
}
</style>